<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<link href='https://fonts.googleapis.com/css?family=Architects+Daughter' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="static/css/1bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="static/easyui/themes/bootstrap/easyui.css">
<link rel="stylesheet" type="text/css" href="static/easyui/themes/icon.css">
<link rel="stylesheet" href="static/css/style.css" />
<link rel="stylesheet" href="static/css/tcommon.css" />
<script src="static/js/1jquery.min.js"></script>
<script src="static/js/1bootstrap.min.js"></script>
<script src="static/jquery/jquery-1.12.4.js"></script>
<script src="static/easyui/jquery.easyui.min.js"></script>
<script src="static/easyui/locale/easyui-lang-zh_CN.js"></script>
<title>收件箱</title>
<style type="text/css">
table thead tr {
	background: #CEE7FB;
}

table td {
	font-size: 12px;
}
</style>
</head>
<body>
	<div style="padding: 10px;">
		<table class="table table-hover" id="mailtable">
			<thead>
				<tr>
					<th>标题</th>
					<th>内容</th>
					<th>发送者</th>
					<th>日期</th>
					<th>操作</th>
					<th>删除</th>
				</tr>
			</thead>
			<tbody id="mailList"></tbody>
		</table>
	</div>
	<div id="test"></div>
	<!-- 模态框（Modal） -->
	<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
		<div class="modal-dialog" role="document">
			<div class="modal-content">
				<div class="modal-header">
					<button onclick=closeletter() type="button" class="close" data-dismiss="modal" aria-label="Close">
						<span aexampleModal1ria-hidden="true">×</span>
					</button>
					<h4 class="modal-title" id="exampleModalLabel">内容</h4>
				</div>
				<div class="modal-body" style="height: 500px; overflow: scroll;"></div>
				<div class="modal-footer">
					<button onclick=closeletter() type="button" class="btn btn-default" data-dismiss="modal">Close</button>
				</div>
			</div>
		</div>
	</div>

	<div style="display: none">
		<div id="displayAtt" class="datagrid-toolbar"
			style="width: 80%; max-height: 80%; padding: 5px; top: 30px; text-align: center;"></div>
	</div>
</body>
<script>
	function openletter(id) {
		$.ajax({
			type : 'GET',
			url : 'Msg?id=' + id,
			dataType : "json",
			success : function(data) {
				var modal = $(".modal-body");
				modal.append(data.message);
			},
		});
	}
	function closeletter() {
		var modal = $(".modal-body");
		modal.empty();
		window.location.reload();
	}
	function getMail() {
		$.ajax({
			type : 'GET',
			url : 'getMsg', //请求参数
			dataType : "json",
			success : function(data) {
				var mailList = $("#mailList");
				mailList.empty(); //若不做清空处理，列表则会重复叠加
				if (data){
					$.each(data, function(i,mail) {
						var showMsg = mail.message;
						if (showMsg.length > 20){
							var showMsg = showMsg.substring(0, 20) + "...";
						}
						var date = new Date(mail.senddate);
						var Y = date.getFullYear() + '-';
						var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
						var D = date.getDate() + '';
						var time = Y + M + D;
						var email = "";
						if(mail.state==1){
							email += "<tr><td><a onclick=openletter(" + mail.id
							+ ") data-toggle='modal'  data-target='#exampleModal'>" + mail.title
							+ "&nbsp;<span class='badge badge-important'style='background-color:red;color:#fff;'>新</span></a></td>"
						}else{
							email += "<tr><td><a onclick=openletter(" + mail.id
							+ ") data-toggle='modal'  data-target='#exampleModal'>" + mail.title + "</a></td>"
						}
						email += "<td><a onclick=openletter(" + mail.id
								+ ") data-toggle='modal' data-target='#exampleModal'>" + showMsg + "</a></td>"
						if (mail.sendid != null && mail.sendid != 0){
							email += "<td>" + mail.userInfo.name + "</td>"
						}else{
							email += "<td>***</td>"
						}
						email += "<td>" + time + "</td>"
						if (mail.attachments.length > 0){
							var info = JSON.stringify(mail);
							email += "<td><a onclick='viewAtt(" + info.replace(/"/g, '&quot;') + ")' style='color:blue;'>查看附件</a></td>"
						}else{
							email += "<td></td>";
						}
						/* email += "<td><a href=" + "/deletemail.do?id=" + mail.id + " style='color:red'>删除</a></td></tr>" */
						email += '<td><a onclick="deletemail(' + mail.id + ')" style="color:red">删除</a></td></tr>'
						mailList.append(email);
					});
				}
			}
		});
	}
	function viewAtt(mail) {
		var row = mail;
		var tb = "";
		$.each(row.attachments,function(i,val) {
			if(isImage(val.url)){
				tb+= '<img onclick="window.open(\'../'+val.url+ 
				'\',\'_blank\', \' toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no\');" '+
				'src="../'+val.url+'" style="width:100px;"><br><span>'+val.name+'</span><br>';
			}else{
				tb+= '<a href="javascript:void(0)" onclick="attachmentFile('+val.id+',\''+val.name+
				'\')"><span>'+val.name+'</span></a><br>';
			}
		});
		$('#displayAtt').empty().html(tb);
		$('#displayAtt').dialog({
			title : '附件',
			resizable : true,
			closed : false,
			cache : false,
			modal : true
		});
	}
	function attachmentFile(id,name) {
		$.get('attachmentFile.do?id=' + id, function(data) {
			blob = new Blob([ data ])
			var a = document.createElement('a');
			a.download = name;
			a.href = window.URL.createObjectURL(blob)
			a.click()
		})
	}
	function deletemail(id) {
		$.messager.confirm("操作提示", "您确定要执行操作吗？", function(data) {
			$.ajax({
				type : 'DELETE',
				url : 'deletemail.do?id=' + id,
				success : function(data) {
					if (data.success){
						$.messager.alert('提示', '删除成功', 'success');
						window.setInterval("location.reload()", 2000);
					}else{
						$.messager.alert('提示', '删除失败', 'error');
						window.setInterval("location.reload()", 2000);
					}
				},
				dataType : "json"
			});
		});
	}
	function isImage(url) {
		var index= url.lastIndexOf(".");
		var ext = url.substr(index+1);
		return [ 'png', 'jpg', 'jpeg', 'bmp', 'gif', 'webp', 'psd', 'svg', 'tiff' ,'ico'].
				indexOf(ext.toLowerCase()) !== -1;
	}
	getMail();
</script>
</html>